<template>
  <div style="text-align:center;">
    <GalleryCardNews v-for="(i,index) in content" :key="index"
      :detail = "i.detail"
      :imgUrl = "i.imgUrl"
    />
  </div>
</template>

<script>
import GalleryCardNews from "./GalleryCardNews.vue"
export default {
  components: { GalleryCardNews },
  props: {
    gallaytype : {type:String,default:""},
  },
  data() {
    return {
      content: [],
      jsonid: 0,
      jsonUrlList:[
        '/json/GalleryGroup.json',
        '/json/GalleryLab.json',
      ]
    };
  },
  watch: {
    //监听路由是否变化
    gallaytype :{ 
      immediate: true, // 这句重要
      handler() {
        this.init()
      }
    }
  },
  methods: {
    init() {
      if (this.gallaytype == "group") {
        this.jsonid = 0;
      } else {
        this.jsonid = 1;      
      }
      this.$http.get(this.jsonUrlList[this.jsonid]).then((response) => {
        // console.log(response);
        this.content = response.data.content;
      });
    },
  },
  created() {
    this.init()
  }
};
</script>

<style lang="less" scoped>

</style>
